/*
* © 2010 Autodata Solutions Company. All Rights Reserved
* This source code is the confidential and proprietary information of Autodata Solutions Company.
* The user shall not, in whole or in part, copy, publish, disclose or make any use of this source code
* without the prior written consent of Autodata Solutions Company.
*/
Ext.ns('net.autodata.compare.photos');
(function () {
	
var Store = Ext.extend(Ext.data.Store, {
		
		constructor: function (cfg)
		{
			cfg = cfg || {};
			
			Ext.apply(cfg, {
				autoLoad: false,
				reader: new Ext.data.JsonReader({
					root: '',					
					fields: [
						{name: 'acode'},
						{name: 'shotId'},
						{name: 'imageName'},
						{name: 'imageType'},
					]
				})
			});
			
			Store.superclass.constructor.call(this, cfg);
		}
	});
	
	
	/**
	 * @class PhotoSelector
	 * @extends Ext.BoxComponent
	 * @namespace net.autodata.compare.photos
	 */
	var Panel = Ext.extend(Ext.BoxComponent, {
		
		autoEl: {
			tag: 'div',
			cls: 'photo-selector'
		},
		
		width: 788,
		height: 94,
		view: undefined,
		
		exteriorButton: undefined,
		interiorButton: undefined,
		
		prevButton: undefined,
		nextButton: undefined,
		
		constructor: function ()
		{
			this.addEvents({
				'photoselected': true
			});
			
			this.store = new Store();
			Panel.superclass.constructor.apply(this, arguments);
        },

		initComponent: function ()
		{
			Panel.superclass.initComponent.apply(this, arguments);
			var view = this.getView();
			view.init(this);
			
			view.on('thumbselected', this.onThumbSelected, this);
			
			var toggleGroup = Ext.id(undefined, 'photo-selector-btns');
			
			var exteriorText = ASC.message('net.autodata.compare.photos.label.exterior');
			var interiorText = ASC.message('net.autodata.compare.photos.label.interior');
			
			this.exteriorButton = new Ext.Button({
				ctCls: 'a-btn-imgtypetoggle',
				width: 114,
				/*height: 36,*/
				text: exteriorText,
				enableToggle: true,
				toggleGroup: toggleGroup,
				toggleHandler: function (btn, pressed) {
					if (!pressed) {
						this.interiorButton.toggle(true);
					}
				},				
				handler: this.onExteriorClick,
				scope: this
			});
			
			this.interiorButton = new Ext.Button({
				ctCls: 'a-btn-imgtypetoggle',
				width: 114,
				/*height: 36,*/
				text: interiorText,
				enableToggle: true,
				toggleGroup: toggleGroup,
				toggleHandler: function (btn, pressed) {
					if (!pressed) {
						this.exteriorButton.toggle(true);
					}
				},
				handler: this.onInteriorClick,
				scope: this
			});
			
			this.prevButton = new Ext.Button({
				ctCls: 'a-btn-alt',
				text: '&lt;',
				width: 16,
				height: 16,
				handleMouseEvents: false,
				handler: this.onPrevClick,
				scope: this
			});
			
			this.nextButton = new Ext.Button({
				ctCls: 'a-btn-alt',
				text: '&gt;',
				width: 16,
				height: 16,
				handleMouseEvents: false,
				handler: this.onNextClick,
				scope: this
			});
			
		},
		
		getStore: function ()
		{
			return this.store;
		},
		
		getView: function () 
		{
			if (!this.view) {
				this.view = new net.autodata.compare.photos.PhotoSelectorView(this.viewCfg);
			}
			return this.view;
		},
		
		onExteriorClick: function ()
		{
			this.getView().selectFirstByType('exterior');
		},
		
		onInteriorClick: function ()
		{
			this.getView().selectFirstByType('interior');
		},
		
		onPrevClick: function ()
		{
			this.getView().selectPrevious();
		},
		
		onNextClick: function ()
		{
			this.getView().selectNext();
		},
		
		/**
		 * @private
		 */
		onThumbSelected: function (iofImage)
		{
			if (iofImage.imageType === 'exterior') {
				this.exteriorButton.toggle(true);
			} else {
				this.interiorButton.toggle(true);
			}
			
			var imgInfo = {
				shotId: iofImage.shotId,
				imageType: iofImage.imageType,
				imageName: iofImage.imageName
			};
			
			this.fireEvent('photoselected', imgInfo);
		},
		
		/**
		 * @private
		 */
		onRender: function ()
		{
			Panel.superclass.onRender.apply(this, arguments);
			var view = this.getView();
			view.render();
		},
		
		/**
		 * @private
		 */
		onDestroy: function ()
		{	
			var view = this.getView();
			if (view) {
				view.on('thumbselected', this.onThumbSelected, this);
			}
			Panel.superclass.onDestroy.apply(this, arguments);
		}
		
	});	
	
	net.autodata.compare.photos.PhotoSelectorPanel = Panel;
})();
